import router from './router'
import store from '@/store'
import NProgress from 'nprogress'
import 'nprogress/nprogress.css'
import getPageTitle from '@/utils/get-page-title'

NProgress.configure({ showSpinner: false }) // 进度条最右侧不出现加载小圆圈

const whiteList = ['/login', '/404'] // 数组

router.beforeEach(async (to, from, next) => {
  NProgress.start()
  const token = store.getters.token
  if (token) {
    if (to.path === '/login') {
      next('/') // (它是异步的, 所以还会让下面代码都走完, 再跳转路由, 再进一次路由守卫)中断本来要跳转到登录页面的导航, 强制跳转到'/', 会让浏览器地址栏的路由地址改变, 重新去匹配路由规则数组, 匹配后再次重新执行路由守卫(直到走了next()才放行跳转页面)
      NProgress.done() // 因为中断了本次跳转, 所以后置守卫不走, 没人关闭本次进度条
    } else {
      next() // 先放行
      if (!store.getters.name) {
        // 调用user模块下获取用户信息的actions, 有值保存到vuex中
        store.dispatch('user/getUserInfoActions')
      }
    }
  } else {
    if (whiteList.includes(to.path)) {
      next()
    } else {
      next('/login')
      NProgress.done()
    }
  }
  // next() // 必须走这句话才会让路由页面正常跳转
  // // 只要路由路径地址改变了, 都会重新执行一次路由守卫
  // // 例如: 强制中断导航跳转, 重新跳转新地址, next('/'), 会让路由守卫再次执行
  // !!!
})

// 使用场景: 全局一些跳转路由后的公共的效果
router.afterEach((to, from) => {
  document.title = getPageTitle(to.meta.title)
  NProgress.done()
})
